<template>
  <div id="app" :class="{ wrapperProcess: isProcess }">
    <!-- <Header :isShow="isShow" :isIndex="isIndex" v-if="showHeader"></Header> -->
    <Header
      :isShow="isShow"
      :isIndex="isIndex"
      ref="head"
      v-if="showHeader"
    ></Header>
    <router-view />
  </div>
</template>

<script>
import Header from "./components/Header";
export default {
  components: {
    Header,
  },
  data() {
    return {
      isProcess: false,
      routesData: [],
      isRouterAlive: true,
      isShow: false,
      isIndex: false,
      showHeader: true,
    };
  },
  methods: {
    //设置页面
    setPage() {
      this.routesData = this.$router.options.routes;
      this.routesData.forEach((v) => {
        if (
          v.path === "/basicinfo" ||
          v.path === "/signup" ||
          v.path === "/selectgrade" ||
          v.path === "/results" ||
          v.path === "/"
        ) {
          this.isProcess = true;
        } else {
          this.isProcess = false;
        }
        //判断是否显示登录信息
        if (v.path === "/register") {
          this.isShow = true;
        } else {
          this.isShow = false;
        }
        // 判断是不是首页
        if (v.path === "/" || v.path == "/error" || v.path === "/empty") {
          this.isIndex = true;
        } else {
          this.isIndex = false;
        }

        if (
          v.path === "/register" ||
          v.path === "/zmkm" ||
          v.path === "/forgot" ||
          v.path === "/privacy"
        ) {
          this.showHeader = false;
        } else {
          this.showHeader = true;
        }
      });
    },
    reload() {
      this.isRouterAlive = false;
      this.$nextTick(function () {
        this.isRouterAlive = true;
      });
    },
  },
  computed: {},
  mounted() {
    this.setPage();
  },
  provide() {
    return {
      reload: this.reload,
    };
  },
  updated: function () {
    /* 判断显示的背景 */
    let path = this.$route.path;
    if (
      path === "/basicinfo" ||
      path === "/signup" ||
      path === "/selectgrade" ||
      path === "/results" ||
      path === "/"
    ) {
      this.isProcess = true;
    } else {
      this.isProcess = false;
    }
    //判断是否显示登录信息
    if (path === "/register") {
      this.isShow = true;
    } else {
      this.isShow = false;
    }
    //判断是不是首页
    if (path === "/" || path === "/error" || path === "/empty") {
      this.isIndex = true;
    } else {
      this.isIndex = false;
    }

    if (
      path === "/register" ||
      path === "/zmkm" ||
      path === "/forgot" ||
      path === "/privacy"
    ) {
      this.showHeader = false;
    } else {
      this.showHeader = true;
    }
  },
};
</script>
<style lang="scss">
#app {
  height: 100%;
  overflow-y: auto;
  position: relative;
  &.wrapperProcess {
    background: #f9f9f9;
  }
}
</style>
